<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich" >

	<ui:composition template="/templates/gerenciamento.xhtml" >
		<ui:define name="js">
		
		</ui:define>
		<ui:define name="css">
			<link rel="stylesheet" type="text/css" href="style/folha_gerenciamento.css" media="screen" />
			<link rel="stylesheet" type="text/css" href="style/logado.css" media="screen" />
			<link rel="stylesheet" type="text/css" href="style/styles.css" media="screen" />
			<link rel="stylesheet" type="text/css" href="style/styles2.css" media="screen" />
			<style type="text/css">
			body {
				margin-left: 0px;
				margin-top: 0px;
				margin-right: 0px;
				margin-bottom: 0px;
			}
			</style>
		</ui:define>
		<ui:define name="mid">
			<h:form>
			
				<div id='cssmenu'>
					<ul>
						<li>
							<a4j:commandLink action="#{logadoBean.goGerenciamentoMeuUsaCardHistorico}">
								<span>HISTÓRICO</span>
							</a4j:commandLink>	
						</li>
					
						<li>
							<a4j:commandLink action="#{logadoBean.goGerenciamentoMeuUsaCardRecarregueSeuCartao}" >
								<span>RECARREGUE SEU CARTÃO</span>
							</a4j:commandLink>
						</li>
						<li class='active'>
							<a4j:commandLink>
								<span>GERENCIE SEU CARTÃO</span>
							</a4j:commandLink>
						</li>
						<li>
							<a4j:commandLink action="#{logadoBean.goGerenciamentoEditarPerfil}">
								<span>PERFIL</span>
							</a4j:commandLink>
						</li>
					</ul>
				</div>
				<div class="inside_extrato">
					<h:form id="form">
						<div class="inside_A">
					    	
					    	<a4j:repeat value="#{gerencieCartaoBean.cartoesUsuario}" var="cartao" >
					    	
					    		<div class="desbloquear_p1"></div>
						    	<div class="desbloquear_p2">
								  	<div class="desbloquear_div" id="fonte_azul_11px">
								  		<h:outputText value="Titular" rendered="#{!cartao.adicional}" /> 
								  		<h:outputText value="Adicional" rendered="#{cartao.adicional}" /> 
								  	</div>
								  	<div class="desbloquear_div" id="fonte_laranja_11px">
								  		<h:outputText value="#{cartao.nominal}" /> 
								  	</div>
								  	<div class="desbloquear_div" id="fonte_azul_11px">Numero do cartão</div>
								    <div class="desbloquear_div" id="fonte_laranja_11px">
								    	<a4j:commandLink value="#{cartao.numeroSimpl}" action="#{gerencieCartaoBean.defineCartao}" execute="@form" render="@all">
								    		<a4j:param value="#{cartao.id}" assignTo="#{gerencieCartaoBean.cartaoEscolhido}" />
								    	</a4j:commandLink>
								    </div>
								    <div class="desbloquear_div2" id="fonte_azul_11px">Status: <span id="fonte_laranja_11px"><strong>
								    	<h:outputText value="#{cartao.statusCartao.nome}" /> 
								    </strong></span></div>
						  	 	</div>
						  	 	
					      </a4j:repeat>
					      
					  </div>
				  
					  <h:panelGroup id="opcoes" rendered="#{gerencieCartaoBean.cartao != null}">
						<div class="inside_B">
							
					    	<h:panelGroup rendered="#{gerencieCartaoBean.opcaoMostra == 1}">
						    	<div id='cssmenu2'>
						            <ul>
						            	<h:panelGroup rendered="#{gerencieCartaoBean.cartao.statusCartao.id == 3}">
							                <li class='active'>
							                	<a4j:commandLink action="#{gerencieCartaoBean.telaDesbloquear}" execute="@this" render="@all">
							                		<span>Desbloquear</span>
							                	</a4j:commandLink>
							                </li>
							            </h:panelGroup>    	
							            <h:panelGroup rendered="#{gerencieCartaoBean.cartao.statusCartao.id == 1}">
							            	<li class='active'>
							                	<a4j:commandLink action="#{gerencieCartaoBean.telaBloquear}" execute="@this" render="@all">
							                		<span>Bloquear</span>
							                	</a4j:commandLink>
							                </li>
							            </h:panelGroup>
						                <li>
						                	<a4j:commandLink action="#{gerencieCartaoBean.tela2Via}" execute="@this" render="@all">
						                		<span>2ª Via</span>
						                	</a4j:commandLink>
						                </li>
						                
						            </ul>
								</div>
							</h:panelGroup>	
							<h:panelGroup rendered="#{gerencieCartaoBean.opcaoMostra == 2}">
						    	<div id='cssmenu2'>
						            <ul>
						                <h:panelGroup rendered="#{gerencieCartaoBean.cartao.statusCartao.id == 3}">
							                <li>
							                	<a4j:commandLink action="#{gerencieCartaoBean.telaDesbloquear}" execute="@this" render="@all">
							                		<span>Desbloquear</span>
							                	</a4j:commandLink>
							                </li>
							            </h:panelGroup>    	
							            <h:panelGroup rendered="#{gerencieCartaoBean.cartao.statusCartao.id == 1}">
							            	<li>
							                	<a4j:commandLink action="#{gerencieCartaoBean.telaBloquear}" execute="@this" render="@all">
							                		<span>Bloquear</span>
							                	</a4j:commandLink>
							                </li>
							            </h:panelGroup>
						                <li class='active'>
						                	<a4j:commandLink action="#{gerencieCartaoBean.tela2Via}" execute="@this" render="@all">
						                		<span>2ª Via</span>
						                	</a4j:commandLink>
						                </li>
						                
						            </ul>
								</div>
							</h:panelGroup>	
							<h:panelGroup rendered="#{gerencieCartaoBean.opcaoMostra == 3}">
						    	<div id='cssmenu2'>
						            <ul>
						                <h:panelGroup rendered="#{gerencieCartaoBean.cartao.statusCartao.id == 3}">
							                <li>
							                	<a4j:commandLink action="#{gerencieCartaoBean.telaDesbloquear}" execute="@this" render="@all">
							                		<span>Desbloquear</span>
							                	</a4j:commandLink>
							                </li>
							            </h:panelGroup>    	
							            <h:panelGroup rendered="#{gerencieCartaoBean.cartao.statusCartao.id == 1}">
							            	<li>
							                	<a4j:commandLink action="#{gerencieCartaoBean.telaBloquear}" execute="@this" render="@all">
							                		<span>Bloquear</span>
							                	</a4j:commandLink>
							                </li>
							            </h:panelGroup>
						                <li>
						                	<a4j:commandLink action="#{gerencieCartaoBean.tela2Via}" execute="@this" render="@all">
						                		<span>2ª Via</span>
						                	</a4j:commandLink>
						                </li>
						                
						            </ul>
								</div>
							</h:panelGroup>	
				
							<h:panelGroup rendered="#{gerencieCartaoBean.opcaoMostra == 1 and gerencieCartaoBean.cartao.statusCartao.id == 3}">
						    	<div class="desbloquear_right">
						    		<div class="desbloquear_inside_p1">
						        		<div class="desbloquear_nomecartao2"></div>
						        		<div class="desbloquear_nomecartao2">Cartão&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						        			<h:outputText value="#{gerencieCartaoBean.cartao.numeroSimpl}" />
						        		</div>
						          		<div class="desbloquear_nomecartao2">Nome&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
						          			<h:outputText value="#{gerencieCartaoBean.cartao.nominal}" />
						          		</div>
						      		</div>
						        	<div class="desbloquear_inside_p2">
						        		<div class="desbloquear_botao_cancelar" id="link4" align="center">
						        			<a4j:commandLink action="#{gerencieCartaoBean.desbloquear}" execute="@this" render="@all" value="Desbloquear" />
						        		</div>
						        		<div class="desbloquear_botao_cancelar" align="center" id="link4">
						        			<a4j:commandLink action="#{gerencieCartaoBean.cancelar}" execute="@this" render="@all" value="Sair" />
						        		</div>
						        	</div>
						    	</div>
						    </h:panelGroup>
						    <h:panelGroup rendered="#{gerencieCartaoBean.opcaoMostra == 1 and gerencieCartaoBean.cartao.statusCartao.id == 1}">
						    	<div class="desbloquear_right">
							    	<div class="desbloquear_inside_p1">
							        	<div class="desbloquear_nomecartao2">Cartão&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							        		<h:outputText value="#{gerencieCartaoBean.cartao.numeroSimpl}" />
							        	</div>
							        	<div class="desbloquear_nomecartao2">Nome&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							        		<h:outputText value="#{gerencieCartaoBean.cartao.nominal}" />
							        	</div>
							          	<div class="desbloquear_nomecartao2">Motivo&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							          		<h:selectOneMenu id="mtvbloq" value="#{gerencieCartaoBean.motivoBloqueio}" converter="motivoBloqueioConverter" style="width:140px;" > 
									      		<f:selectItem itemLabel="Motivos de Bloqueio" />
												<f:selectItems value="#{gerencieCartaoBean.motivosBloqueio}" var="motivo" itemLabel="#{motivo.nome}" itemValue="#{motivo}"/> 
										  	</h:selectOneMenu>
							          	</div>
							          	
							      	</div>
							        <div class="desbloquear_inside_p2">
							        	<div class="desbloquear_botao_cancelar" id="link4" align="center">
											<a4j:commandLink action="#{gerencieCartaoBean.bloquear}" execute="@this mtvbloq" render="@all" value="Bloquear" />
										</div>
							        	<div class="desbloquear_botao_cancelar" id="link4" align="center">
							        		<a4j:commandLink action="#{gerencieCartaoBean.cancelar}" execute="@this" render="@all" value="Sair" />
							        	</div>
							        </div>
							    </div>
						    </h:panelGroup>
						    <h:panelGroup rendered="#{gerencieCartaoBean.opcaoMostra == 2}">
						    	<div class="desbloquear_right">
							    	<div class="desbloquear_inside_p1">
							        	<div class="desbloquear_nomecartao2"></div>
							        	<div class="desbloquear_nomecartao2">Cartão&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							        		<h:outputText value="#{gerencieCartaoBean.cartao.numeroSimpl}" />
							        	</div>
							          	<div class="desbloquear_nomecartao2">Nome&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							          		<h:outputText value="#{gerencieCartaoBean.cartao.nominal}" />
							          	</div>
							          	<div align="left" class="desbloquear_rodape2" id="fonte_azul_10px">2ª via de cartão</div>
							        	<div class="desbloquear_nomecartao2">Motivo&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							          		<h:selectOneMenu value="#{gerencieCartaoBean.motivoBloqueio}" converter="motivoBloqueioConverter" style="width:140px;" > 
									      		<f:selectItem itemLabel="Motivos de Bloqueio" />
												<f:selectItems value="#{gerencieCartaoBean.motivosBloqueio}" var="motivo" itemLabel="#{motivo.nome}" itemValue="#{motivo}"/> 
										  	</h:selectOneMenu>
										</div>  	
							      	</div>
							        <div class="desbloquear_inside_p2">
							        	<div class="desbloquear_botao_cancelar" id="link4" align="center">
							          		<a4j:commandLink action="#{gerencieCartaoBean.segundaVia}" execute="@this" render="@all" value="Confirmar" />
							          	</div>
							        	<div class="desbloquear_botao_cancelar" align="center" id="link4">
							        		<a4j:commandLink action="#{gerencieCartaoBean.cancelar}" execute="@this" render="@all" value="Sair" />
							        	</div>
							        </div>
							    </div>
						    </h:panelGroup>
						    <h:panelGroup rendered="#{gerencieCartaoBean.opcaoMostra == 3}">
						    	<div class="desbloquear_right">
							    	<div class="desbloquear_inside_p1">
							    	  	<div class="desbloquear_campo1">
							    	    	<h:inputText value="#{gerencieCartaoBean.senhaAtual}" maxlength="4" />
							    	  	</div>
							    	  	<div class="desbloquear_campo2a" align="right">Senha atual:</div>
							    	  	<div class="desbloquear_campo1">
							    	    	<h:inputText value="#{gerencieCartaoBean.novaSenha}" maxlength="4" />
							  	    	</div>
							    	  	<div class="desbloquear_campo2a" align="right">Nova senha:</div>
							        	<div class="desbloquear_rodape" align="right">Máximo de 4 caracteres</div>
							       	  	<div class="desbloquear_campo1">
							        	  	<h:inputText value="#{gerencieCartaoBean.confirmaNovaSenha}" maxlength="4" />
							      	  	</div>
							       	  	<div class="desbloquear_campo2a" align="right">Nova senha:</div>
							      	</div>
							        <div class="desbloquear_inside_p2">
							        	<div class="desbloquear_botao_cancelar" id="link4" align="center">
							        		<a4j:commandLink action="#{gerencieCartaoBean.alterarSenha}" execute="@this" render="@all" value="Alterar" />
							        	</div>
							        	<div class="desbloquear_botao_cancelar" align="center" id="link4">
							        		<a4j:commandLink action="#{gerencieCartaoBean.cancelar}" execute="@this" render="@all" value="Sair" />
							        	</div>
							        </div>
						    	</div>
						    </h:panelGroup>
						    	
					  	</div>
					</h:panelGroup>	
					
				</h:form>
				
				</div>
			

			</h:form>
		</ui:define>
	</ui:composition>

</html>